﻿<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link href="@SiteUrl.GetStaticResourceScriptUrl("~/css/framework-font.css")" rel="stylesheet" />
    <link href="@SiteUrl.GetStaticResourceScriptUrl("~/css/framework-ui.css")" rel="stylesheet" />
    <script src="@SiteUrl.GetStaticResourceScriptUrl("~/js/jquery/jquery.choose.js")"></script>
    <link href="@SiteUrl.GetStaticResourceScriptUrl("~/css/framework-theme.css")" rel="stylesheet" />
    <link href="@SiteUrl.GetStaticResourceScriptUrl("~/js/bootstrap/bootstrap.min.css")" rel="stylesheet" />
    <link href="@SiteUrl.GetStaticResourceScriptUrl("~/css/framework-theme.css")" rel="stylesheet" />
    <script src="@SiteUrl.GetStaticResourceScriptUrl("~/js/charts/Chart.js")"></script>
    <script>
        $(function () {
            GetSalaryChart();
            GetLeaveChart();
            $('.menuItem').on('click', window.parent.$.Newtouchtab.addTab);
        });

        function GetSalaryChart() {
            //var randomScalingFactor = function () { return Math.round(Math.random() * 100) };
            var OutpatientList =[];
            var InpatientList = [];
            //折线图 获取就诊人数
            $.ajax({
                url: "/Home/GetVisitNum?r=" + Math.random(),
                dataType: "json",
                async: false,
                cache: false,
                success: function (data) {
                    if (data.data) {
                        OutpatientList = data.data.OutpatientList;
                        InpatientList = data.data.InpatientList
                    } else {
                        for (var i = 0; i < 12; i++) {
                            OutpatientList.push([0]);
                            InpatientList.push([0]);
                        }
                    }
                }
            });

            var lineChartData = {
                labels: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "8月", "10月", "11月", "12月"],
                datasets: [
                    {
                        label: "My First dataset",
                        fillColor: "rgba(220,220,220,0.2)",
                        strokeColor: "rgba(220,220,220,1)",
                        pointColor: "rgba(220,220,220,1)",
                        pointStrokeColor: "#fff",
                        pointHighlightFill: "#fff",
                        pointHighlightStroke: "rgba(220,220,220,1)",
                        //data: [200, 11, 11,11, randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()]
                        data: [
                            OutpatientList[0].num, OutpatientList[1].num, OutpatientList[2].num, OutpatientList[3].num, OutpatientList[4].num, OutpatientList[5].num, OutpatientList[6].num, OutpatientList[7].num, OutpatientList[8].num, OutpatientList[9].num, OutpatientList[10].num, OutpatientList[11].num
                        ]
                    },
                    {
                        label: "My Second dataset",
                        fillColor: "rgba(151,187,205,0.2)",
                        strokeColor: "rgba(151,187,205,1)",
                        pointColor: "rgba(151,187,205,1)",
                        pointStrokeColor: "#fff",
                        pointHighlightFill: "#fff",
                        pointHighlightStroke: "rgba(151,187,205,1)",
                        //data: [randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor(), randomScalingFactor()]
                        data: [
                            InpatientList[0].num, InpatientList[1].num, InpatientList[2].num, InpatientList[3].num, InpatientList[4].num, InpatientList[5].num, InpatientList[6].num, InpatientList[7].num, InpatientList[8].num, InpatientList[9].num, InpatientList[10].num, InpatientList[11].num
                        ]
                    }
                ]
            }
            var ctx = document.getElementById("salarychart").getContext("2d");
            window.myLine = new Chart(ctx).Line(lineChartData, {
                responsive: false,
                bezierCurve: false
            });
        }
        function GetLeaveChart() {
            //var randomScalingFactor = function () { return Math.round(Math.random() * 100) };
            //饼状图 获取就诊人数
            var outpatientCount = 0;
            var inpatientCount = 0;
            $.ajax({
                url: "/Home/GetVisitNum?r=" + Math.random(),
                dataType: "json",
                async: false,
                cache: false,
                success: function (data) {
                    if (data.data != null && data.data.OutpatientList != null) {
                        for (var i = 0; i < data.data.OutpatientList.length; i++) {
                            outpatientCount += data.data.OutpatientList[i].num;
                        }
                    }
                    if (data.data != null && data.data.InpatientList != null) {
                        for (var i = 0; i < data.data.InpatientList.length; i++) {
                            inpatientCount += data.data.InpatientList[i].num;
                        }
                    }
                }
            })
            //var a_value = randomScalingFactor();
            //var b_value = randomScalingFactor();
            var doughnutData = [
	            {
	                value: outpatientCount,
	                color: "#46BFBD",
	                highlight: "#5AD3D1",
	                label: "门诊"
	            },
	            {
	                value: inpatientCount,
	                color: "#FDB45C",
	                highlight: "#FFC870",
	                label: "住院"
	            }
            ];
            var ctx = document.getElementById("leavechart").getContext("2d");
            window.myDoughnut = new Chart(ctx).Doughnut(doughnutData, { responsive: false });
            $("#a_value").html(outpatientCount + "人");
            $("#b_value").html(inpatientCount + "人");
        }
    </script>
</head>
<body>
    <div id="areascontent">
        <div class="rows" style="margin-bottom: 1%; border: 1px solid #e6e6e6; overflow: hidden; padding-left: 1px;">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <i class="fa fa-line-chart fa-lg" style="padding-right: 5px;"></i>快捷菜单
                    @*<div style="float: right; position: relative; top: -4px; right: 0px;">
                            <iframe name="weather_inc" src="http://i.tianqi.com/index.php?c=code&id=1" width="330" height="35" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
                        </div>*@
                </div>
                <div class="panel-body">
                    <a class="menuItem" href="/OutpatientManage/OutpatientAccounting/Index">
                        <div class="dashboard-stats">
                            <div class="dashboard-stats-item" style="background-color: #fc8675;">
                                @*<h2 class="m-top-none">8</h2>*@
                                <h4>门诊记账</h4>
                                <div class="stat-icon">
                                    <i class="fa fa-user fa-3x"></i>
                                </div>
                            </div>
                        </div>
                    </a>
                    <a class="menuItem" href="/OutpatientManage/OutpatientRefund/Index">
                        <div class="dashboard-stats">
                            <div class="dashboard-stats-item" style="background-color: #6bafbd;">
                                @*<h2 class="m-top-none">12</h2>*@
                                <h4>门诊退费</h4>
                                <div class="stat-icon">
                                    <i class="fa fa-hdd-o fa-3x"></i>
                                </div>
                            </div>
                        </div>
                    </a>
                    <a class="menuItem" href="/HospitalizationManage/BookkeepInHos/Accounting">
                        <div class="dashboard-stats">
                            <div class="dashboard-stats-item" style="background-color: #f3ce85;">
                                @*<h2 class="m-top-none">2</h2>*@
                                <h4>住院记账</h4>
                                <div class="stat-icon">
                                    <i class="fa fa-shopping-cart fa-3x"></i>
                                </div>
                            </div>
                        </div>
                    </a>
                    <a class="menuItem" href="/HospitalizationManage/BookkeepInHos/AccountingExecution">
                        <div class="dashboard-stats">
                            <div class="dashboard-stats-item" style="background-color: #949FB1;">
                                @*<h2 class="m-top-none">6</h2>*@
                                <h4>住院记账执行</h4>
                                <div class="stat-icon">
                                    <i class="fa fa-gavel fa-3x"></i>
                                </div>
                            </div>
                        </div>
                    </a>
                    <a class="menuItem" href="/HospitalizationManage/InpatientRefund/Index">
                        <div class="dashboard-stats">
                            <div class="dashboard-stats-item" style="background-color: #65cea7; margin-right: 0px;">
                                @*<h2 class="m-top-none">268</h2>*@
                                <h4>住院退费</h4>
                                <div class="stat-icon">
                                    <i class="fa fa-truck fa-3x"></i>
                                </div>
                            </div>
                        </div>
                    </a>
                </div>
            </div>
        </div>
        <div class="rows" style="margin-bottom: 1%; overflow: hidden;">
            <div style="float: left; width: 69%;">
                <div style="height: 350px; border: 1px solid #e6e6e6; background-color: #fff;">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <i class="fa fa-area-chart fa-lg" style="padding-right: 5px;"></i>就诊人数
                            <div style="float: right">
                                <span style="font-weight: 500;"><i class="fa fa-square" style="color: #dcdcdc; font-size: 20px; padding-right: 5px; vertical-align: middle; margin-top: -3px;"></i>门诊</span>
                                <span style="margin-left: 10px; font-weight: 500;"><i class="fa fa-square" style="color: #97bbcd; font-size: 20px; padding-right: 5px; vertical-align: middle; margin-top: -3px;"></i>住院</span>
                            </div>
                        </div>
                        <div class="panel-body" style="padding-bottom: 0px;">
                            <canvas id="salarychart" style="height: 285px; width: 100%; padding-right: 10px;"></canvas>
                        </div>
                    </div>
                </div>
            </div>
            <div style="float: right; width: 30%;">
                <div style="height: 350px; border: 1px solid #e6e6e6; background-color: #fff;">
                    <div class="panel panel-default">
                        <div class="panel-heading"><i class="fa fa-pie-chart fa-lg" style="padding-right: 5px;"></i>就诊类别统计</div>
                        <div class="panel-body" style="padding-top: 20px;">
                            <canvas id="leavechart" style="height: 160px; width: 100%;"></canvas>
                            <div style="text-align: center; padding-top: 20px;">
                                <span><i class="fa fa-square" style="color: #46bfbd; font-size: 20px; padding-right: 5px; vertical-align: middle; margin-top: -3px;"></i>门诊</span>
                                <span style="margin-left: 10px;"><i class="fa fa-square" style="color: #fdb45c; font-size: 20px; padding-right: 5px; vertical-align: middle; margin-top: -3px;"></i>住院</span>
                            </div>
                            <div style="margin-top: 20px; padding-top: 18px; height: 60px; border-top: 1px solid #e6e6e6;">
                                <div style="width: 25%; text-align: center; float: left;margin-left:23%">
                                    <span id="a_value">0人</span>
                                    <p style="color: #a1a1a1">门诊</p>
                                </div>
                                <div style="width: 25%; text-align: center; float: left;">
                                    <span id="b_value">0人</span>
                                    <p style="color: #a1a1a1">住院</p>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @*<div class="rows" style="overflow: hidden;">
                <div style="float: left; width: 34%; margin-right: 1%;">
                    <div style="height: 265px; border: 1px solid #e6e6e6; background-color: #fff;">
                        <div class="panel panel-default">
                            <div class="panel-heading"><i class="fa fa-thumbs-o-up fa-lg" style="padding-right: 5px;"></i>系统更新</div>
                            <div class="panel-body">
                                <ul>
                                    <li><a href="#">系统版本发布V1.7</a><span class="time">2016-12-21</span></li>
                                    <li><a href="#">系统版本发布V1.6</a><span class="time">2016-12-20</span></li>
                                    <li><a href="#">系统版本发布V1.5</a><span class="time">2016-12-19</span></li>
                                    <li><a href="#">系统版本发布V1.4</a><span class="time">2016-12-17</span></li>
                                    <li><a href="#">系统版本发布V1.3</a><span class="time">2016-12-17</span></li>
                                    <li><a href="#">系统版本发布V1.2</a><span class="time">2016-12-13</span></li>
                                    <li><a href="#">系统版本升级V1.1</a><span class="time">2016-12-12</span></li>
                                    <li><a href="#">系统版本发布V1.0</a><span class="time">2016-12-12</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div style="float: left; width: 34%; margin-right: 1%;">
                    <div style="height: 265px; border: 1px solid #e6e6e6; background-color: #fff;">
                        <div class="panel panel-default">
                            <div class="panel-heading"><i class="fa fa-rss fa-lg" style="padding-right: 5px;"></i>通知公告</div>
                            <div class="panel-body">
                                <ul>
                                    <li><a href="#">【通知】新版员工守则，即日执行</a><span class="time">2016-12-21</span></li>
                                    <li><a href="#">【公告】OA办公使用指南</a><span class="time">2016-12-21</span></li>
                                    <li><a href="#">【公告】劳动节集体出游指南</a><span class="time">2016-12-21</span></li>
                                    <li><a href="#">【通知】2016年G20财长和央行行</a><span class="time">2016-12-21</span></li>
                                    <li><a href="#">【通知】2016年G20财长和央行行</a><span class="time">2016-12-21</span></li>
                                    <li><a href="#">【通知】品牌价值的最佳选择</a><span class="time">2016-12-21</span></li>
                                    <li><a href="#">【公告】采购商城全新升级自营业正品</a><span class="time">2016-12-21</span></li>
                                    <li><a href="#">【公告】采购商城全新升级自营业正品</a><span class="time">2016-12-21</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
                <div style="float: right; width: 30%;">
                    <div style="height: 265px; border: 1px solid #e6e6e6; background-color: #fff;">
                        <div class="panel panel-default">
                            <div class="panel-heading"><i class="fa fa-send fa-lg" style="padding-right: 5px;"></i>企业文化</div>
                            <div class="panel-body">
                                <ul>
                                    <li><a href="#">创新企业党建思想政治工作</a><span class="time">2016-12-02</span></li>
                                    <li><a href="#">现代国有企业道德体系初构</a><span class="time">2016-12-18</span></li>
                                    <li><a href="#">国有企业文化问题根源及文化重塑任务分析</a><span class="time">2016-12-26</span></li>
                                    <li><a href="#">国有企业文化建设必须突出员工文化</a><span class="time">2016-12-20</span></li>
                                    <li><a href="#">加强企业公民建设 推进企业和谐发展</a><span class="time">2016-12-08</span></li>
                                    <li><a href="#">不断提升大庆精神 实现企业持续发展</a><span class="time">2016-12-22</span></li>
                                    <li><a href="#">科学发展作指导 人水和谐路更宽</a><span class="time">2016-12-15</span></li>
                                    <li><a href="#">科学发展作指导 人水和谐路更宽</a><span class="time">2016-12-15</span></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>*@
    </div>
    <style>
        #copyrightcontent {
            height: 30px;
            line-height: 29px;
            overflow: hidden;
            position: absolute;
            top: 100%;
            margin-top: -30px;
            width: 100%;
            background-color: #fff;
            border: 1px solid #e6e6e6;
            padding-left: 10px;
            padding-right: 10px;
        }

        .dashboard-stats {
            float: left;
            width: 20%;
        }

        .dashboard-stats-item {
            position: relative;
            overflow: hidden;
            color: #fff;
            cursor: pointer;
            height: 105px;
            margin-right: 25px;
            margin-bottom: 10px;
            padding: 20px 20px;
        }

            .dashboard-stats-item .m-top-none {
                margin-top: 2px;
            }

            .dashboard-stats-item h2 {
                font-size: 35px;
                font-family: inherit;
                line-height: 1.1;
                font-weight: 500;
            }

            .dashboard-stats-item h5 {
                font-size: 14px;
                font-family: inherit;
                margin-top: 3px;
                line-height: 1.1;
            }


            .dashboard-stats-item .stat-icon {
                position: absolute;
                top: 10px;
                right: 10px;
                font-size: 30px;
                opacity: .3;
            }

        .dashboard-stats i.fa.stats-icon {
            width: 50px;
            padding: 20px;
            font-size: 50px;
            text-align: center;
            color: #fff;
            height: 50px;
            border-radius: 10px;
        }

        .panel-default {
            border: none;
            border-radius: 0px;
            margin-bottom: 0px;
            box-shadow: none;
            -webkit-box-shadow: none;
        }

            .panel-default > .panel-heading {
                color: #777;
                background-color: #fff;
                border-color: #e6e6e6;
                padding: 10px 10px;
            }

            .panel-default > .panel-body {
                padding: 10px;
                padding-bottom: 0px;
            }

                .panel-default > .panel-body ul {
                    overflow: hidden;
                    padding: 0;
                    margin: 0px;
                    margin-top: -5px;
                }

                    .panel-default > .panel-body ul li {
                        line-height: 27px;
                        list-style-type: none;
                        white-space: nowrap;
                        text-overflow: ellipsis;
                    }

                        .panel-default > .panel-body ul li .time {
                            color: #a1a1a1;
                            float: right;
                            padding-right: 5px;
                        }
    </style>
</body>
</html>
